@inject ToastService ToastService
<DataTable Data="data" TItem="Person" IsNarrow IsHoverable
           IsBordered IsStriped IsFullwidth>
    <DataTableColumn Label="Id" Prop="Id"/>
    <DataTableColumn Label="名称" Prop="Name"/>
    <DataTableColumn ThClass="@B.TextCentered" TdClass="@B.TextDanger" Label="年龄" Prop="Age">
        <ThSlot>
            <strong>自定义头-年龄</strong>
        </ThSlot>
        <TdSlot>
            @{ var p = (Person) context; }
            自定义列,年龄：@p.Age
        </TdSlot>
    </DataTableColumn>
    <DataTableColumn Label="性别" Prop="Gender"/>
    <DataTableColumn Label="生日" Format="yyyy-MM-dd HH:mm" Prop="Birthday"/>
    <DataTableColumn Label="空行" Width="80"/>
    <DataTableColumn Label="操作" Width="180">
        <TdSlot>
            <Buttons HasAddons>
                <Button @onclick="() => OptFun((Person) context)" IsSmall Color="Color.Info">Edit</Button>
                <Button @onclick="() => OptFun((Person) context)" IsSmall Color="Color.Danger">Delete</Button>
            </Buttons>
        </TdSlot>
    </DataTableColumn>

</DataTable>
<Pagination TotalCount="@totalCount" PageIndex="pageIndex" PageSize="pageSize" OnPageChange="onPage"
            NextText="下一页" PrevText="上一页" IsCentered IsSmall/>

@code{
    int pageIndex = 1;
    int pageSize = 5;
    int totalCount = 0;
    IEnumerable<Person> data;
    //分页
    void onPage(int page)
    {
        pageIndex = page;
        searchData();
    }

    //查询后台数据
    void searchData()
    {
        data = Person.GetPageData("", pageIndex, pageSize, out int total);
        totalCount = total;
    }

    protected override void OnInitialized()
    {
        base.OnInitialized();
        searchData();
    }

    private void OptFun(Person item)
    {
        ToastService.Show("自己实现逻辑");
    }

}